<template>
  <div class="home">
    <h1>首页</h1>
    <div>
      <button v-if="!isLogin" @click="login()">登录</button>
      <button v-else @click="logout()">注销</button>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'Home',
    data() {
      return {
        isLogin : false
      }
    },
    mounted() {
      this.isLogin = this.checkLogin();
      console.log(this.isLogin)
    },
    methods: {
      checkLogin(){
        return localStorage.getItem('isLogin') === "true";
      },
      login() {
        localStorage.setItem('isLogin', 'true');
        this.isLogin = true;
      },
      logout() {
        localStorage.removeItem('isLogin');
        this.isLogin = false;
      }
    }
  }
</script>


<style scoped>
  .home{
    text-align: center;
  }
</style>
